<template>
  <Nav_bar title="提现历史记录" />
  <div class="historyCashBox">
    <div class="tableBox">
      <Table :isPding="true" :headList="headList" :bodyList="bodyList" @clickItem="clickItem" />
      <Pagination
        v-if="bodyList.length"
        v-model:page="pageParam.pageNum"
        :total="total"
        @pageChange="getCashHistory()"
        class="Pagination"
      />
    </div>
  </div>
  <Tabbar />
  <van-action-sheet
    v-model:show="show"
    :actions="actions"
    cancel-text="取消"
    close-on-click-action
    @select="select"
  />
</template>

<script setup>
import { ref, reactive } from 'vue'
import { showConfirmDialog } from 'vant'
import { getCashHistoryApi } from '@/api/ivestorCash/ivestorCash'

const total = ref(0)
const show = ref(false)
const headList = [
  { _title: '编号', key: 'withdrawSn' },
  { _title: '提现金额', key: 'money' },
  { _title: '提现日期', key: 'applyTime', style: 'font-size: 11px;' },
  { _title: '余额', key: 'currentBalance' },
  { _title: '状态', key: 'status' },
]
const bodyList = ref([])
const actions = [{ name: '(0571) 8605 2917', icon: 'service-o' }]
const pageParam = ref({
  pageNum: 1,
  pageSize: 10,
})
/** 获取历史记录列表 */
const getCashHistory = async () => {
  const res = await getCashHistoryApi(pageParam.value)
  console.log(res)
  total.value = res.data.total
  bodyList.value = res?.data.rows.map((item) => {
    return {
      ...item,
      id: item.id,
      withdrawSn: item.withdrawSn?.slice(-4),
      money: item.money && '￥' + item.money,
      applyTime: item.applyTime.split('T')[0],
      currentBalance: item.currentBalance && '￥' + item.currentBalance,
      status:
        item.status === 1
          ? '驳回'
          : item.status === 2
            ? '待审核'
            : item.status === 3
              ? '待打款'
              : item.status === 4
                ? '已完成'
                : '',
    }
  })
  // console.log(bodyList.value)
}

/** 点击失败的返回 */
const clickItem = (item) => {
  console.log(item)
  if (item.status !== '驳回') return
  showConfirmDialog({
    title: '驳回原因',
    message: item.remark,
    confirmButtonText: '取消',
    confirmButtonColor: '#999999',
    cancelButtonText: '联系客服',
    cancelButtonColor: '#0DB383',
    // beforeClose,
  })
    .then(() => {
      // on confirm
    })
    .catch(() => {
      // on cancel
      show.value = true
    })
}
/** 拉起手机电话 */
const select = () => {
  window.location.href = 'tel:18157169817'
}
getCashHistory()
</script>

<style lang="scss" scoped>
.historyCashBox {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 10px;
  .tableBox {
    width: 347px;
    height: calc(100vh - 161px);
    background: #fff;
  }
  .Pagination {
    position: absolute;
    left: 13px;
    bottom: 8px;
  }
}
</style>
